package com.abc.robot01.fragment

import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.selection.selectable
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicText
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.MutableState
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.text.SpanStyle
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.withStyle
import androidx.compose.ui.unit.DpSize
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.fragment.app.Fragment
import androidx.fragment.app.viewModels
import com.abc.robot01.Base64QrCodeImage
import com.abc.robot01.activity.MYBLACK
import com.abc.robot01.activity.MYBLACK_Percent5
import com.abc.robot01.activity.MYBLACK_Percent80
import com.abc.robot01.activity.MYBLUE
import com.abc.robot01.activity.MinimalDialog
import com.abc.robot01.activity.MyFont_Size
import com.abc.robot01.activity.SystemFragmentBackground
import com.abc.robot01.activity.mysp
import com.abc.robot01.activity.px
import com.abc.robot01.vivemodel.WalletViewModel

/**
 * 首页配置
 */
class WalletFragment : Fragment() {

    private val viewModel: WalletViewModel by viewModels()
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        viewModel.getData()
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {
        val composeView = ComposeView(requireContext()).apply {
            setContent {
                val current = remember { mutableStateOf("") }
                val amount by remember { viewModel.amount }
                SystemFragmentBackground{
                    Column(modifier = Modifier
                        .fillMaxWidth()
                        .fillMaxHeight()
                        .padding(start = 30.px, end = 30.px),
                        verticalArrangement = Arrangement.Top) {
                        Row(modifier = Modifier.padding(start = 0.px, top = 40.px)) {
                            BasicText(
                                text = "当前余额: ",
                                style = TextStyle(
                                    fontSize = MyFont_Size,
                                    color = Color.Black,
                                    fontWeight = FontWeight.Bold
                                ),
                            )
                            BasicText(
                                text = amount,
                                style = TextStyle(
                                    color = MYBLUE,
                                    fontWeight = FontWeight.Bold,
                                    fontSize = MyFont_Size,
                                ),
                            )

                            BasicText(
                                text = "元",
                                style = TextStyle(
                                    color = Color.Black,
                                    fontWeight = FontWeight.Bold,
                                    fontSize = MyFont_Size,
                                ),
                            )

                        }
                        Spacer(modifier = Modifier.height(40.px))
                        BasicText(
                            text = "请选择充值金额",
                            style = TextStyle(
                                fontSize = MyFont_Size,
                                color = MYBLACK_Percent80
                            ),
                        )


                        var success by remember {  viewModel.success}

                        if(success){
                            MinimalDialog{
                                success = false
                            }
                        }

                        val values = viewModel.types.collectAsState()
                        LazyVerticalGrid(
                            contentPadding = PaddingValues(top = 30.px),
                            horizontalArrangement = Arrangement.spacedBy(51.px),
                            verticalArrangement = Arrangement.spacedBy(20.px),
                            columns = GridCells.Fixed(3), // 2 columns in the grid
                            modifier = Modifier
                                .fillMaxWidth()
                                .padding(start = 30.px)
                        ) {
                            items(values.value) { item ->
                                Button(item,current){
                                    current.value =it
                                    viewModel.recharge(it.toDouble())
                                }
                            }
                        }

                        Spacer(modifier = Modifier.height(30.px))
                        Row(verticalAlignment = Alignment.CenterVertically) {
                            Base64QrCodeImage(viewModel.base64)
                            Spacer(modifier = Modifier.width(40.px))
                            if(current.value.equals("").not()) {
                                Column {
                                    BasicText(
                                        text = "应付金额" + current.value + "元",
                                        style = TextStyle(
                                            fontSize = 38.mysp,
                                            color = MYBLACK,
                                        )
                                    )
                                    Spacer(modifier = Modifier.height(20.px))
                                    BasicText(
                                        text = "请使用微信扫码完成充值",
                                        style = TextStyle(
                                            fontSize = 24.mysp,
                                            color = MYBLACK_Percent80,
                                        )
                                    )
                                }
                            }
                        }
                    }
              }
            }
        }
        return  composeView
    }

    @Composable
    fun Button(text:String, current: MutableState<String>, onClick:(String)->Unit){
        MyButton09(
            current =current,
            modifier= Modifier,
            shape = RoundedCornerShape(20.px
            ),
            text = text,
            containerColor = MYBLACK_Percent5,
            textColor = MYBLACK_Percent80,
            size = DpSize(566.dp/3.5f,102.dp/3.5f)){
            onClick(text)
        }
    }
}

/**
 * 钱包页面定制
 */
@Composable
fun MyButton09(current: MutableState<String>,modifier : Modifier=Modifier, text:String, containerColor:Color = MYBLACK_Percent5, shape: Shape = ButtonDefaults.shape,
               textColor:Color = Color.White,
               size: DpSize = DpSize(144.dp/3.5f,44.dp/3.5f),
               fontSize: TextUnit = MyFont_Size, click: (text:String) -> Unit = {  }) {

    val  selected  = remember {
        mutableStateOf(true)
    }

    if(current.value ==text)
        selected.value = true
    else
        selected.value = false

    Button(
        contentPadding=  PaddingValues(
            start = 0.dp,
            top = 0.dp,
            end = 0.dp,
            bottom = 0.dp
        ) ,
        onClick =  {click(text)
            selected.value = selected.value.not()
                   },
        colors =  ButtonDefaults.buttonColors(
            containerColor = containerColor,
            contentColor = textColor
        ),
        shape = shape,
        border = if(selected.value) BorderStroke(2.px, Color.Blue)  else null ,
        modifier = modifier
            .size(size)
            .selectable(selected = selected.value, enabled = true) {
//            selected.value = selected.value.not()
            }
    ) {
        Text(
            text = buildAnnotatedString {
                withStyle(style = SpanStyle(fontSize = 42.mysp, color =textColor)) {
                    append(text)
                }
                append("")
                withStyle(style = SpanStyle(fontSize = 22.mysp, color = textColor)) {
                    append("元")
                }
            }
        )
    }
}

